<template>
  <div>
    <h2>属性绑定指令</h2>
  <p>{{ age}}</p>
  <!-- 事件绑定一 事件处理程序，如果只是简单的语句，可以直接写到属性中  -->
  <!-- 事件处理代码，只能使用vue相关的代码【比如console.log()不行】 -->
  <button v-on:click="age++">age+1</button>
  <!-- 事件绑定：语法二，事件处理程序，使用方法 -->
  <!-- 事件处理方法，必须定义到和data平级的methods中 -->
   <button @click="changeAge">按钮</button>
  </div>
</template>

<script>
export default {
  data () {
    return {
     age:30
    }
  },
   methods: {
    changeAge() {
      this.age++ // this表示当前Vue对象（这里先记住，后续讲解）
    }
  }
}
</script>

<style>
h2{
  color: aquamarine;
}
</style>

